<template>
	<div class="index">
	  <div class="center">
		<left></left>
		<div class="right">
		  <top></top>
		  <div class="hei10"></div>
		  <!-- <div class="team">
			<div class="powertop">
			  <div class="powertopcon">
				<div  class="powertopli"  >店铺信息</div>
			  </div>
			</div>
		  </div> -->
		  <div class="con">
			<el-page-header @back="goBack" content="订单重查"></el-page-header>
			<!-- tips -->
			<div class="t_tips_box" style="margin-top: 30px;">
				<div>该功能可查询由您生产的订单，生产号码激活情况，查询的前提条件：1、接口支持查询、2、我们已开发相应查询功能</div>
			</div>
			<div class="t_search_box">
			  
			  <div style="margin-top: 30px;display: flex;">
				
				
				<upload-excel-component class="t_dr_btn"  @on-selected-file="exportData" buttonName="导入查询表">
								  </upload-excel-component>
				  <el-button type="text" style="margin-left: 10px;" @click="xiazai">下载模板</el-button>
			  </div>
			</div>
			<div>
			  <el-table
			  :header-cell-style="{ 
			  background:'#F4F4F4',
			  color:'#7D8087'}"
				:data="tableData"
				style="width: 100%;margin-top: 20px;">
				<el-table-column
				  prop="updated_at"
				  align="center"
				  label="导入时间">
				</el-table-column>
				<el-table-column
				  prop="state_name"
				  align="center"
				  label="查询状态">
				  <!-- <template slot-scope="scope">
					<span v-if="scope.row.state==100">申请中</span>
					<span v-if="scope.row.state==200">办理中</span>
					<span v-if="scope.row.state==300">已到账</span>
					<span v-if="scope.row.state==-400">到账失败</span>
				  </template> -->
				</el-table-column>
				<el-table-column
				  prop="find_num"
				  align="center"
				  label="查询单量">
				</el-table-column>
				<el-table-column
				  prop="already_num"
				  align="center"
				  label="查询成功">
				</el-table-column>
				<el-table-column
				  prop="fail_num"
				  align="center"
				  label="查询失败">
				</el-table-column>
				<el-table-column
				  align="center"
				  label="操作">
				  <template slot-scope="scope">
					<el-button v-if="scope.row.excel_path" @click="xiazai2(scope.row.excel_path)" type="text">下载失败明细</el-button>
				  </template> 
				</el-table-column>
			  </el-table>
			  <div style="text-align: right;margin-top: 20px;">
				<el-pagination
				  @current-change="changepage"
				  background
				  :page-size="searchform.pageSize"
				  layout="total,prev, pager, next"
				  :total="total">
				</el-pagination>
			  </div>
			</div>
		  </div>
		</div>
	  </div>
	  <!-- 成功 -->
	  <!-- <el-dialog
		title="登记成功"
		:visible.sync="successdialog"
		center="true"
		width="500px">
		<div style="text-align: center;color: #FF0000;">
		  该账号符合领取条件，已成功登记
		</div>
		<span slot="footer" class="dialog-footer">
		  <el-button type="danger" style="background-color: #2974FF;" round @click="successdialog = false">确 定</el-button>
		</span>
	  </el-dialog> -->
	   <!-- 失败 -->
	   <!-- <el-dialog
		title="领取失败"
		:visible.sync="faildialog"
		center="true"
		width="500px">
		<div style="text-align: left;color: #FF0000;width: 400px;margin-left: auto;margin-right: auto;">
		  {{ failmsg }}
		</div>
		<span slot="footer" class="dialog-footer">
		  <el-button type="danger" style="background-color: #2974FF;" round @click="faildialog = false">确 定</el-button>
		</span>
	  </el-dialog> -->
	  <!-- 导入结果 -->
	  <el-dialog
		title="导入结果"
		:visible.sync="daorures"
		center="true"
		width="500px">
		<div style="text-align: center;color: #FF0000;width: 400px;margin-left: auto;margin-right: auto;">
		  <div>
			<div style="color: #67C23A;">成功数量：{{ successnum }}</div>
		  </div>
		  <div v-if="failed.length!=0">
			失败原因：{{ failed.toString() }}
		  </div>
		</div>
		<span slot="footer" class="dialog-footer">
		  <el-button type="danger" style="background-color: #2974FF;" round @click="daorures = false">确 定</el-button>
		</span>
	  </el-dialog>
	</div>
  </template>
  
  <script>
	import axios from "axios";
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
	import robot from '@/components/robot.vue'
	import UploadExcelComponent from "@/components/UploadExcel/index3.vue";
  
	export default {
	  components: {
		"left": left,
		"top": top,
		'foot': foot,
		"robot":robot,
		UploadExcelComponent
	  },
	  name: 'productionBasismanagCheck',
	  data() {
		return {
		  
		  shopid:'',
		  searchform:{
			number:'',
			qytype:'',
			page:1,
			pageSize:20
		  },
		  tableData: [],
			successdialog:false,
			faildialog:false,
			failmsg:'',
			total:1000,
			daorures:false,
			successnum:0,
			failed:[],
			isloadquan:false
  
  
		}
	  },
	  created() {
		//店铺权限问题
			  this.shopid = JSON.parse(localStorage.getItem('SHOP')).shop_id;
		//列表
		this.getlist()
	   
	  },
	  methods: {
		//登记
		// adddengji(){
		// 	if(this.searchform.number==''){
		// 	  this.$message.error('请填写电话');
		// 	  return
		// 	}
		// 	if(this.searchform.qytype==''){
		// 	  this.$message.error('请选择权益');
		// 	  return
		// 	}
  
		// 	axios.post('/api/plan-market/goods/gift/record/add',{
		// 	  mobile:this.searchform.number,
		// 	  gift:this.searchform.qytype,
		// 	})
		// 	.then((response) => {
		// 	  if (response.data.msg.code == 0) {
		// 		//成功
		// 		this.successdialog = true
			   
		// 		//清空数据
		// 		this.searchform.number=''
		// 		this.searchform.qytype=''
  
		// 		this.getlist()
		// 	  }else {
		// 		  //失败
		// 		  this.failmsg = response.data.msg.info
		// 		  this.faildialog = true
		// 		  //清空数据
		// 		  this.searchform.number=''
		// 		  this.searchform.qytype=''
		// 		  this.getlist()
		// 	  }
		// 	})
		// },
		//搜索
		// searchbtn(){
		//   this.searchform.page = 1
		//   //列表
		//   this.getlist()
		// },
		//列表
		getlist(){
		  axios.get('/api/plan-market/order/requery/list',{
			params:{
			  mobile:this.searchform.number,
			  page:this.searchform.page,
			  pageSize:this.searchform.pageSize,
			}
		  })
			.then((response) => {
			  if (response.data.msg.code == 0) {
				console.log('列表')
				console.log(response)
				this.tableData = response.data.data.data
				this.total = response.data.data.total
			  } else {
				this.$message.error(response.data.msg.info);
			  }
			})
		},
		//翻页
		changepage(val){
		  console.log(val)
		  this.searchform.page = val
		  this.getlist()
		},
		
		//下载模板
		xiazai:function(){
				  const a = document.createElement('a');
				  a.setAttribute('download', '重查列表.xlsx');
				  a.setAttribute('href', window.location.origin+window.location.pathname+'static/chongcha.xlsx');
				  a.click();
				  console.log(window.location.origin+window.location.pathname+'static/chongcha.xlsx')
			  },
		//下载数据
		xiazai2(url){
			const a = document.createElement('a');
			a.setAttribute('download', '失败明细.xlsx');
			a.setAttribute('href', url);
			a.click();
		},
		//导入
		exportData(data) {
		 
				  var that = this
				  let list = []
					  for (var i = 0; i < data.results.length; i++) {
						//   var obj = {}
							if(!data.results[i]['订单ID']){
								this.$message.error('请填写订单ID');
								return
							}
						//   obj['order_ids'] = data.results[i]['订单ID']
						
						  list.push(data.results[i]['订单ID'])
					  }
					console.log(list)
					  
					  axios.post("/api/plan-market/order/requery/export", {
							order_ids: list
						  })
						  .then((response) =>{
							console.log(response)
							  if (response.data.msg.code == 0) {
				//   that.successnum = response.data.data.success
				//   that.failed = response.data.data.failed
				//   that.daorures = true
								this.$message({
									message: '上传成功',
									type: 'success'
								});
								  
								  this.getlist();
							  } else {
								  this.$message.error(response.data.msg.info);
							  }
						  })
  
			  },
			  //返回
			  goBack(){
				this.$router.push({'path':'/productionBasismanag/productionBasismanagDj'})
			  }
	  },
	  beforeDestroy(){
	   
	  },
	  
	  
	}
  </script>
  
  <style  scoped>
  
	  .t_dr_btn{
		  text-align: center;
		  width: 160px;
		  background-color:#2974FF;
		  border-radius: 4px;
	  }
	  /deep/ .t_dr_btn .el-button--text{
		color: white;
	  }
  
	  .team {
		background: #F9F9F9;
	  }
  
	  .powertop {
		display: flex;
		justify-content: space-between;
		align-items: center;
	  }
	  .powertopcon {
		display: flex;
		width: 800px;
	  }
	  .t_jqr_box{
		background-color: #007EFF;
		color: white;
		font-size: 14px;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 32px;
		width: 160px;
		margin-right: 30px;
		border-radius: 3px;
		cursor: pointer;
  
	  }
	  .powertopli {
		width: 180px;
		line-height: 50px;
		border-bottom: 3px #F9F9F9 solid;
		color: #727272;
		border-right: 1px #F9F9F9 solid;
		font-size: 16px;
		text-align: center;
		cursor: pointer;
	  }
  
	  .powertopact {
		background: #FFFFFF;
		border-bottom: 3px #2974FF solid;
		color:#2974FF ;
	  }
  
	  .piliang {}
  
	  .piliangxuan {
		padding: 3px 0;
	  }
  
	  .mesquanxuan {
		padding: 10px 30px 20px 0px;
		display: flex;
		font-size: 14px;
		background: #f4f4f4
	  }
	  .con {
				  padding: 20px ;
	  }
	  .t_overtips{
		width: 100%;
		overflow: hidden;        /*内容会被修剪，并且其余内容是不可见的*/
		text-overflow:ellipsis;  /*显示省略符号来代表被修剪的文本。*/
		white-space: nowrap;     /*文本不换行*/
	  }
	  .t_tongji_box{
		background-color: rgb(241, 241, 241);
		padding: 16px 30px;
		box-sizing: border-box;
		/* font-size: 18px; */
		display: flex;
		color: #515151;
		margin-top: 20px;
		margin-bottom: 20px;
	  }
	  .t_title_box{
		display: flex;
		align-items: center;
		color: #525252;
		margin-bottom: 10px;
		margin-top: 20px;
	  }
	  .t_red_g{
		background-color: #2974FF;
		width: 4px;
		height: 16px;
		margin-right: 10px;
	  }
	  .t_red_time{
		color: #2974FF;
	  }
	  .t_search_input{
		width: 191px;
		margin-bottom: 5px;
	  }
	  /* .t_search_box{
		display: flex;
		flex-wrap: wrap;
	  } */
	  /deep/.t_search_box .el-input--suffix .el-input__inner  {
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-range-editor.el-input__inner{
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-date-editor .el-range-input{
		background-color: #f7f8fa;
		border: none;
	  }
	  /deep/.t_search_box .el-input__inner{
		background-color: #f7f8fa;
		border: none;
		
	  }
	  .t_tips_box{
			background-color: #EEF7FF;
			display: flex;
			justify-content: space-between;
			font-size: 14px;
			padding: 20px ;
			color: #7D7D7D;
			margin-bottom: 20px;
		}
	
  </style>
  